<template>
  <div>
    <!-- 内容部分 -->
    <!-- <ul class="content">
      <router-link
        :to="'home/photoList/' + item.id"
        class="item"
        v-for="(item, index) in photoList"
        :key="index"
      > -->
        <!-- <img :src="item.img_url" v-lazy=""> -->
        <!-- <img v-lazy="item.img_url">
        <div class="box">
          <p>{{item.title}}</p>
        </div>
      </router-link> -->
    <!-- </ul> -->
    <p>图片列表界面</p>
    <p>{{id}}</p>
  </div>
</template>
<script>

export default {
  data() {
    return {
      id: '',
      photoList: []
    };
  },
  created(){
    this.id = this.$route.params.id
    console.log(this.$route.params.id);
    
  },
  mounted() {
    this.ScrollInit();
    // console.log(this.imgctg);
    // this.getCategory();
    // this.getPhotoList();
    
  },
  methods: {
    ScrollInit() {
      // var myScroll = new IScroll(".topScroll", {
      //   mouseWheel: true,
      //   // scrollbars: true,
      //   scrollX: true
      // });
    },
    
    // getPhotoList() {
    //   this.$http.get("api/getimages/0").then(result => {
    //     if (result.body.status == 0) {
    //       this.photoList = result.body.message;
    //     }
    //   });
    // }
  }
};
</script>
<style lang="less" scoped>
.content {
  width: 100%;
  padding: 5px 5px;
    margin: 0;
    padding: 0;
  .item {
    position: relative;
    margin-bottom: 5px;
    text-decoration: none;
    background-color: #ccc;
    text-align: center;
    img {
      width: 100%;
    }
    // 懒加载中的图片
    img[lazy="loading"] {
      width: 40px;
      height: 300px;
      margin: auto;
    }
    .box {
      width: 100%;
      height: 60px;
      position: absolute;
      left: 0;
      bottom: 0;
      background-color: rgba(0, 0, 0, 0.4);
      p {
        color: #fff;
        
      }
    }
  }
}
</style>
